<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Awesome-pyecharts</title>
            <script type="text/javascript" src="https://assets.pyecharts.org/assets/echarts.min.js"></script>

</head>
<body>
    <div id="332a71833a4b41539443123943b5d89d" style="width:100%; height:600px;"></div>
    <script>
        var chart_332a71833a4b41539443123943b5d89d = echarts.init(
            document.getElementById('332a71833a4b41539443123943b5d89d'), 'white', {renderer: 'canvas'});
        var option_332a71833a4b41539443123943b5d89d = {
    "color": [
        "#c23531",
        "#2f4554",
        "#61a0a8",
        "#d48265",
        "#749f83",
        "#ca8622",
        "#bda29a",
        "#6e7074",
        "#546570",
        "#c4ccd3",
        "#f05b72",
        "#ef5b9c",
        "#f47920",
        "#905a3d",
        "#fab27b",
        "#2a5caa",
        "#444693",
        "#726930",
        "#b2d235",
        "#6d8346",
        "#ac6767",
        "#1d953f",
        "#6950a1",
        "#918597"
    ],
    "series": [
        {
            "type": "graph",
            "layout": "force",
            "circular": {
                "rotateLabel": false
            },
            "force": {
                "repulsion": 50,
                "edgeLength": 50,
                "gravity": 0.2
            },
            "label": {
                "show": false,
                "position": "top",
                "margin": 8,
                "fontSize": 12
            },
            "lineStyle": {
                "width": 1,
                "opacity": 1,
                "curveness": 0.2,
                "type": "solid"
            },
            "roam": true,
            "focusNodeAdjacency": true,
            "data": [
                {
                    "draggable": "False",
                    "name": "HqXx35H8L",
                    "category": "HqXx35H8L",
                    "value": 39.93725393319377,
                    "symbolSize": 8.794039123653409,
                    "username": "\u534e\u5c14\u8857\u65e5\u62a5\u4e2d\u6587\u7f51",
                    "content": "\u3010\u519c\u4e1a\u519c\u6751\u90e8\u9884\u5224\u56db\u5b63\u5ea6\u6d3b\u732a\u4ef7\u683c\u5c06\u7a81\u78342016\u5e74\u5386\u53f2\u9ad8\u70b9\u3011- \u4e2d\u56fd\u519c\u4e1a\u519c\u6751\u90e8\u5468\u4e8c\u8868\u793a\uff0c\u732a\u4ef7\u4e0a\u6da8\uff0c\u662f\u975e\u6d32\u732a\u761f\u75ab\u60c5\u5bf9\u6574\u4e2a\u751f\u732a\u4ea7\u4e1a\u7684\u51b2\u51fb\uff0c\u4ee5\u53ca\u732a\u5468\u671f\u56e0\u7d20\u7684\u53cc\u91cd\u56e0\u7d20\u53e0\u52a0\u5f71\u54cd\u30023\u6708\u4efd\u751f\u732a\u5b58\u680f\u548c\u6bcd\u732a\u5b58\u680f\u51fa\u73b0\u4e86\u201c\u53cc\u4e0b\u964d\u201d\uff0c\u6599\u4eca\u5e74\u5168\u5e74\u732a\u8089\u4ea7\u91cf\u5c06\u4f1a\u4e0b\u964d\uff0c\u540e\u671f\u751f\u732a\u4f9b\u5e94\u4f1a\u8d8b\u7d27\u3002\u8be6\u7ec6\u62a5\u9053\u8bf7\u89c1\uff1ahttp://t.cn/EaSMaJd",
                    "posted_at": "2019-04-23 14:57:00",
                    "comment_count": 32,
                    "forward_count": 19,
                    "like_count": 44
                },
                {
                    "draggable": "False",
                    "name": "HqXWmtuTi",
                    "category": "HqXWmtuTi",
                    "value": 13.744562646538029,
                    "symbolSize": 6.305733451421113,
                    "username": "\u4e2d\u56fd\u9752\u5e74\u62a5",
                    "content": "\u3010\u519c\u4e1a\u519c\u6751\u90e8\uff1a\u732a\u4ef7\u5df2\u7ecf\u63d0\u524d\u8fdb\u5165\u4e0a\u6da8\u5468\u671f\u3011\u5728\u4eca\u5929\u4e0a\u5348\u4e00\u5b63\u5ea6\u519c\u4e1a\u519c\u6751\u7ecf\u6d4e\u8fd0\u884c\u60c5\u51b5\u53d1\u5e03\u4f1a\u4e0a\uff0c\u519c\u4e1a\u519c\u6751\u90e8\u755c\u7267\u517d\u533b\u5c40\u526f\u5c40\u957f\u738b\u4fca\u52cb\u4ecb\u7ecd\uff0c\u975e\u6d32\u732a\u761f\u75ab\u60c5\u5bf9\u6574\u4e2a\u751f\u732a\u4ea7\u4e1a\u7684\u51b2\u51fb\u4e25\u91cd\u3002\u6839\u636e\u519c\u4e1a\u519c\u6751\u90e8\u76d1\u6d4b\u7684\u6570\u636e\uff0c3\u6708\u4efd\u751f\u732a\u5b58\u680f\u548c\u6bcd\u732a\u5b58\u680f\u51fa\u73b0\u4e86\u201c\u53cc\u4e0b\u964d\u201d\uff0c\u4e0b\u964d\u7684\u5e45\u5ea6\u3001\u901f\u5ea6\u4e4b\u5feb\u662f\u8fd1\u5341\u5e74\u6765\u51fa\u73b0\u7684\u6700\u5927\u503c\u3002        \u6b63\u5e38\u5e74\u4efd\uff0c\u6625\u8282\u8fc7\u540e\u732a\u4ef7\u4e0b\u8dcc\u56de\u843d\uff0c\u800c\u4eca\u5e74\u51fa\u73b0\u76f8\u53cd\u884c\u60c5\uff0c\u4e3b\u8981\u539f\u56e0\u662f\u524d\u671f\u51fa\u73b0\u75ab\u60c5\u540e\uff0c\u517b\u6b96\u6237\u7684\u6b63\u5e38\u8865\u680f\u6ca1\u8ddf\u4e0a\uff0c\u53ef\u4ee5\u63d0\u4f9b\u4e0a\u5e02\u7684\u80a5\u732a\u6570\u91cf\u4e0d\u8db3\uff0c\u5bfc\u81f4\u4ef7\u683c\u5feb\u901f\u4e0a\u6da8\u3002\u603b\u7684\u6765\u770b\uff0c\u732a\u4ef7\u5df2\u7ecf\u63d0\u524d\u8fdb\u5165\u4e86\u4e0a\u6da8\u5468\u671f\uff0c\u9884\u5224\u5168\u5e74\u732a\u8089\u4ea7\u91cf\u4f1a\u4e0b\u964d\uff0c\u540e\u671f\u751f\u732a\u4f9b\u5e94\u4f1a\u8d8b\u7d27\uff0c\u56db\u5b63\u5ea6\u6d3b\u732a\u4ef7\u683c\u6216\u5c06\u7a81\u78342016\u5e74\u7684\u5386\u53f2\u9ad8\u70b9\u3002\uff08\u4e2d\u56fd\u9752\u5e74\u62a5\u00b7\u4e2d\u9752\u5728\u7ebf\u8bb0\u8005 \u674e\u6668\u8d6b\uff09",
                    "posted_at": "2019-04-23 15:59:00",
                    "comment_count": 8,
                    "forward_count": 8,
                    "like_count": 25
                },
                {
                    "draggable": "False",
                    "name": "Hr3Ugd00O",
                    "category": "Hr3Ugd00O",
                    "value": 77.96148139681571,
                    "symbolSize": 12.406340732697494,
                    "username": "\u51e4\u51f0\u7f51\u8d22\u7ecf",
                    "content": "\u3010\u65b0\u4e00\u8f6e\u732a\u5468\u671f\u4e34\u8fd1 \u732a\u8089\u4ef7\u6216\u8d8520\u5143/\u516c\u65a4\u5386\u53f2\u9ad8\u70b9\u3011\u4eca\u5e74\u7b2c\u56db\u5b63\u5ea6\uff0c\u6d3b\u732a\u4ef7\u683c\u6216\u5c06\u7a81\u78342016\u5e74\u7684\u5386\u53f2\u9ad8\u70b9\u30024\u670823\u65e5\uff0c\u519c\u4e1a\u519c\u6751\u90e8\u4e3e\u884c\u7684\u4e00\u5b63\u5ea6\u519c\u4e1a\u519c\u6751\u7ecf\u6d4e\u8fd0\u884c\u60c5\u51b5\u53d1\u5e03\u4f1a\u4e0a\u53d1\u5e03\u4e86\u4e0a\u8ff0\u6d88\u606f\u3002\u8fd9\u610f\u5473\u7740\uff0c\u81ea\u53bb\u5e7410\u6708\u975e\u6d32\u732a\u761f\u75ab\u60c5\u7206\u53d1\u4ee5\u6765\uff0c\u751f\u732a\u884c\u4e1a\u5728\u7ecf\u5386\u4e86\u4e00\u6bb5\u5e95\u90e8\u671f\u540e\uff0c\u91cd\u65b0\u8fce\u6765\u884c\u4e1a\u7684\u62d0\u70b9\u3002\u968f\u7740\u751f\u732a\u4ea7\u91cf\u7684\u4e0b\u964d\uff0c\u732a\u8089\u4ef7\u683c\u6216\u8fce\u6765\u65b0\u4e00\u8f6e\u4e0a\u6da8\u5468\u671f\u3002\u4e1c\u6d77\u8bc1\u5238\u884c\u4e1a\u7814\u7a76\u5458\u59da\u661f\u8fb0\u8ba4\u4e3a\uff0c\u672c\u8f6e\u732a\u5468\u671f\u7684\u62d0\u70b9\u5df2\u7ecf\u51fa\u73b0\uff0c\u5e76\u4e14\u6709\u671b\u5728\u4eca\u5e74\u7684\u7b2c\u4e8c\u81f3\u4e09\u5b63\u5ea6\u51fa\u73b0\u8f83\u4e3a\u660e\u663e\u7684\u4e0a\u6da8\uff0c\u9884\u8ba12019\u5e74\u5e74\u672b\u6216\u5c06\u7a81\u783420\u5143/\u516c\u65a4\uff0c\u6709\u671b\u521b\u4e0b\u5386\u53f2\u6700\u9ad8\u732a\u4ef7\u3002 http://t.cn/Eap4CSn",
                    "posted_at": "2019-04-24 07:10:00",
                    "comment_count": 65,
                    "forward_count": 54,
                    "like_count": 114
                },
                {
                    "draggable": "False",
                    "name": "5d09ac966847b0e6971f6395",
                    "category": "HqXx35H8L",
                    "value": 1.2,
                    "symbolSize": 5.114
                },
                {
                    "draggable": "False",
                    "name": "5d09ac976847b0e6971f6398",
                    "category": "HqXx35H8L",
                    "value": 0.3,
                    "symbolSize": 5.0285
                },
                {
                    "draggable": "False",
                    "name": "5d09a2766847b0e6971e98e2",
                    "category": "Hr3Ugd00O",
                    "value": 6.3,
                    "symbolSize": 5.5985
                },
                {
                    "draggable": "False",
                    "name": "5d09a2766847b0e6971e98f2",
                    "category": "Hr3Ugd00O",
                    "value": 0.0,
                    "symbolSize": 5.0
                },
                {
                    "draggable": "False",
                    "name": "5d09a2766847b0e6971e98f6",
                    "category": "Hr3Ugd00O",
                    "value": 0.3,
                    "symbolSize": 5.0285
                },
                {
                    "draggable": "False",
                    "name": "5d09a2766847b0e6971e98fc",
                    "category": "Hr3Ugd00O",
                    "value": 0.0,
                    "symbolSize": 5.0
                },
                {
                    "draggable": "False",
                    "name": "5d09a2766847b0e6971e9902",
                    "category": "Hr3Ugd00O",
                    "value": 0.3,
                    "symbolSize": 5.0285
                },
                {
                    "draggable": "False",
                    "name": "5d09a2b76847b0e6971e9e68",
                    "category": "Hr3Ugd00O",
                    "value": 0.0,
                    "symbolSize": 5.0
                },
                {
                    "draggable": "False",
                    "name": "5d09a2b76847b0e6971e9e82",
                    "category": "Hr3Ugd00O",
                    "value": 0.3,
                    "symbolSize": 5.0285
                }
            ],
            "categories": [
                {
                    "name": "HqXx35H8L"
                },
                {
                    "name": "HqXWmtuTi"
                },
                {
                    "name": "Hr3Ugd00O"
                }
            ],
            "edgeSymbol": [
                null,
                null
            ],
            "edgeSymbolSize": 10,
            "links": [
                {
                    "source": "HqXx35H8L",
                    "target": "5d09ac966847b0e6971f6395",
                    "username": "\u53ef\u6c57\u55b5",
                    "content": "\u4f46\u51e1\u6d89\u53ca\u4e2d\u56fd\u751f\u732a\u517b\u6b96\u4e1a\u7684\uff0c\u6c38\u8fdc\u662f\u8fd9\u5f20\u7834\u70c2\u56fe\uff0c\u6bd5\u7adf\u4e2d\u56fd\u8fd8\u662f\u519c\u4e1a\u56fd\uff0c\u6ca1\u6709\u5927\u89c4\u6a21\u73b0\u4ee3\u5316\u7684\u517b\u6b96\u4e1a\uff0c\u6ca1\u6709\u4f60\u4eec\u767d\u4eba\u9ad8\u5927\u4e0a\u5bf9\u5427",
                    "posted_at": "2019-4-23 15:02:00",
                    "like_count": 4
                },
                {
                    "source": "HqXx35H8L",
                    "target": "5d09ac976847b0e6971f6398",
                    "username": "\u79d1\u957f\u65e5\u8bb0",
                    "content": "\u5565\u5b50\u60c5\u51b5\u54e6\uff1f",
                    "posted_at": "2019-4-23 18:31:00",
                    "like_count": 1
                },
                {
                    "source": "Hr3Ugd00O",
                    "target": "5d09a2766847b0e6971e98e2",
                    "username": "\u6768\u6df1\u60c5\u65ad2014",
                    "content": "\u5427\u4e2d\u56fd\u517b\u732a\u519c\u6c11\u5f7b\u5e95\u8d54\u5230\u4f24\u5fc3\uff0c\u63a5\u7740\u975e\u6d32\u732a\u761f\u6765\u4e86\uff0c\u5916\u56fd\u7684\u732a\u6da8\u4ef7\u4e86\u8fd9\u65f6\u5019\u60f3\u8d77\u4e86\u56fd\u4ea7\u7684\u732a\u662f\u4e0d\u662f\u665a\u4e86\u70b9\uff0c\u8fd9\u6da8\u4ef7\u7684\u75db\u8fd8\u7684\u662f\u5e7f\u5927\u4e2d\u56fd\u6d88\u8d39\u8005\u4e70\u5355",
                    "posted_at": "2019-4-24 07:13:00",
                    "like_count": 21
                },
                {
                    "source": "Hr3Ugd00O",
                    "target": "5d09a2766847b0e6971e98f2",
                    "username": "\u91cf\u5806",
                    "content": "\u732a\u8089\u4ef7\u5c06\u8d85\u5386\u53f2\u9ad8\u4f4d[\u673a\u667a]",
                    "posted_at": "2019-4-24 08:13:00",
                    "like_count": 0
                },
                {
                    "source": "Hr3Ugd00O",
                    "target": "5d09a2766847b0e6971e98f6",
                    "username": "\u8c37\u5b50\u4eae",
                    "content": "\u517b\u732a\u4e0d\u5bb9\u6613\uff0c\u8d35\u70b9\u6ca1\u95ee\u9898",
                    "posted_at": "2019-4-24 07:30:00",
                    "like_count": 1
                },
                {
                    "source": "Hr3Ugd00O",
                    "target": "5d09a2766847b0e6971e98fc",
                    "username": "Hi\u4e0d\u5728\u7231\u4f60\u7684\u4eba",
                    "content": "\u4e0d\u4e0a\u73ed\u4e86\uff0c\u56de\u4e61\u4e0b\u51c6\u5907\u517b\u732a\u53bb",
                    "posted_at": "2019-4-24 07:50:00",
                    "like_count": 0
                },
                {
                    "source": "Hr3Ugd00O",
                    "target": "5d09a2766847b0e6971e9902",
                    "username": "\u81ea\u7136\u7684\u5f20\u4f83",
                    "content": "\u4e0d\u8981\u60ca\u8bb6\u3002\u9664\u4e86\u4fe1\u8a89\u548c\u4fe1\u4ef0\uff0c\u6240\u6709\u7684\u4e1c\u4e1c\u90fd\u5728\u4e0a\u6da8\u3002\u7269\u4ef7\u3001\u5de5\u8d44\u3001\u77e5\u8bc6\u3001\u4eba\u53e3\u3001\u57ce\u5e02\u3001\u6b32\u671b\u3001\u5dee\u8ddd\u2026\u2026\u3002endless \u3002\u5168\u4e16\u754c\u90fd\u4e00\u6837\uff0c\u5c31\u770b\u54ea\u56fd\u9886\u5148\u4e86\u3002",
                    "posted_at": "2019-4-24 07:19:00",
                    "like_count": 1
                },
                {
                    "source": "Hr3Ugd00O",
                    "target": "5d09a2b76847b0e6971e9e68",
                    "username": "\u5f20\u51e1benzhuzhu",
                    "content": "\u8fd8\u597d\u9e21\u7684\u5468\u671f\u77ed",
                    "posted_at": "2019-4-24 08:41:00",
                    "like_count": 0
                },
                {
                    "source": "Hr3Ugd00O",
                    "target": "5d09a2b76847b0e6971e9e82",
                    "username": "\u60ca\u96f7\u7684\u5143\u7d20",
                    "content": "\u8fd9\u7b97\u4e0d\u7b97\u6270\u4e71\u6c11\u5fc3\uff1f\uff01\u6270\u4e71\u5e02\u573a\uff1f\uff01",
                    "posted_at": "2019-4-24 07:22:00",
                    "like_count": 1
                }
            ]
        }
    ],
    "legend": [
        {
            "data": [
                "HqXx35H8L",
                "HqXWmtuTi",
                "Hr3Ugd00O"
            ],
            "selected": {
                "HqXx35H8L": true,
                "HqXWmtuTi": true,
                "Hr3Ugd00O": true
            },
            "show": false
        }
    ],
    "tooltip": {
        "show": true,
        "trigger": "item",
        "triggerOn": "mousemove|click",
        "axisPointer": {
            "type": "line"
        },
        "textStyle": {
            "fontSize": 14
        },
        "borderWidth": 0
    },
    "title": [
        {
            "text": "\u5fae\u535a\u8f6c\u53d1\u5173\u7cfb\u56fe"
        }
    ]
};
        chart_332a71833a4b41539443123943b5d89d.setOption(option_332a71833a4b41539443123943b5d89d);
    </script>

            <script>
            temp = document.createElement('div');
            temp.id = 'username';
            temp.style.cssText = 'divposition:absolute; width:100%; height:100px; top: 620px; left:10px;';
            temp.style.font = '15px Times New Roman'
            document.body.appendChild(temp);
            chart_332a71833a4b41539443123943b5d89d.on('mouseover', function(params) {
                username = params.data.username;
                content = params.data.content;
                if(username && content) {
                    temp.innerHTML = '<h2>' + username + ':</h2>';
                    temp.innerHTML += '<h1>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp' + content + '</h1>';
                    temp.innerHTML += '<h3>'
                    if(comment_count = params.data.comment_count)
                        temp.innerHTML += '评论数：' + comment_count + '&nbsp&nbsp'
                    if(forward_count = params.data.forward_count)
                        temp.innerHTML += '转发数：' + forward_count + '&nbsp&nbsp  '
                    temp.innerHTML += '点赞数：' + params.data.like_count + '&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp';
                    temp.innerHTML += params.data.posted_at + '</h3>';
                }
            });
            chart_332a71833a4b41539443123943b5d89d.on('mouseout', function(params) {
                temp.innerHTML = '';
            });
        </script>
        </body>
</html>
